import React from 'react';

export default class App extends React.Component {
  state = {
    count: 0,
  };

  // 1. 定义事件

  handleClick = (num) => {
    const { count } = this.state;
    // 3. 通过形参和setState修改count
    this.setState({ count: count + num });
  };

  render() {
    // cs： 解构state
    const { count } = this.state;
    return (
      <div>
        <p>当前数值为：{count}</p>
        <hr />
        {/* 2. 绑定事件， 并传参 */}
        <button onClick={() => this.handleClick(1)}>+1</button>
        <span>{count}</span>
        <button onClick={() => this.handleClick(-1)}>-1</button>
      </div>
    );
  }
}
